<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../../js/jquery-1.7.2.js"></script>
    <script type="text/javascript">
        // window.onload = function () {
        //     document.getElementById('btn').onclick = function () {
        //         console.log(document.getElementById('username').value);
        //         console.log(document.getElementById('password').value);
        //         console.log(document.getElementsByName('gender').value);
        //         console.log(document.getElementById('country').value);
        //     }
        // }
        $(function () {
            $('#btn').click(function () {
                //jQuery对象和DOM对象不能使用对方的属性和方法
                // console.log($('#username').value);
                console.log($('#username').val());
                console.log($('#password').val());
                //被选中的 name=gender 的input
                console.log($('[name=gender]:checked').val());
                console.log($('#country').val());
            });
        });
    </script>

</head>
<body>
<form>
    用户名：<input id="username" type="text" name="username"/><br/>
    密码：<input id="password" type="password" name="password"/><br/>
    性别：<input name="gender" type="radio" value="male"/>男<input name="gender" type="radio" value="female"/>女<br/>
    国籍：<select id="country" name="country">
    <option value="China">中国</option>
    <option value="USA">美国</option>
    <option value="England">英国</option>
</select><br/>
    <button type="button" id="btn">注册</button>
</form>
</body>
</html>